import React, { Suspense, lazy } from "react";
import { Routes, Route ,Navigate,useLocation} from "react-router-dom";
import Resource from "./view/Resource";
import Role from "./view/Role";
import User from './view/User'
import Admin from "./pages/Admin"
import NotFound from "./pages/NotFound";
const Login = lazy(() => import(/* webpackChunkName: 'login' */"./pages/Login"));
const Application = lazy(() => import(/* webpackChunkName: 'application',webpackPrefetch: true */"./view/Application"));
function App() {
  return (
    <Suspense fallback={<div>loading...</div>}>
      <Routes>
        <Route path="/" element={<Login />} />
          <Route path="/admin" element={<Admin />}>
          <Route path="/admin/application" element={<Application />}></Route>
          <Route path="/admin/resource" element={<Resource/>}/>
          <Route path="/admin/role" element={<Role/>}/>
          <Route path="/admin/user" element={<User/>}/>
          <Route exact path="/admin" element={<Navigate to='/admin/application'/>}/>
        </Route>
        <Route path='*' element={<NotFound />}></Route>
      </Routes>
    </Suspense>
  );
}

export default App;
